<template>
	<view class="page_view">
		<view class="zhanwei"></view>
		<view class="list_item flex" v-for="(item,index) in list" :key="index" @click="choose_item(item)">
			<view class="flex1">
				<view class="list_item_left">
					{{item.coupon.price}}
				</view>
				<view class="list_item_right">
					<view class="list_item_right_top">
						元
					</view>
					<view class="list_item_right_bottom">
						{{item.coupon.name}}
					</view>
				</view>
			</view>
			<view class="list_right">
				<view class="list_item_right">
					<view class="list_item_right_top">
						{{item.state == 1?'未使用':item.state == 2?'已使用':'已过期'}}
					</view>
					<view class="list_item_right_bottom">
						{{item.expired_at}}到期
					</view>
				</view>
			</view>
		</view>
		<view class="" v-if="list.length == 0">
			<u-empty text="优惠券为空" mode="coupon"></u-empty>
		</view>
	</view>
</template>

<script>
	import { coupon } from '../../api/login.js';
	export default {
		data() {
			return {
				list:[],
				type:'',
			}
		},
		onLoad(options) {
			if(options.type){
				this.type = options.type
			}
		},
		mounted() {
			this.getList();
		},
		methods: {
			getList(){
				coupon().then(res=>{
					if(res.code == 200001){
						this.list = res.data;
					}
				})
			},
			choose_item(item){
				if(this.type = 'use'){
					let cpage = getCurrentPages()
					let page = cpage[cpage.length - 2]
					page.$vm.coupondata = item
					uni.navigateBack()
				}else{
					console.log(item)
				}
			}
		}
	}
</script>

<style>
page{
	background: #F4F4F4;
}
.zhanwei{
	width: 100%;
	height: 20rpx;
}
.page_view{
	width: 100%;
	padding: 0 30rpx;
	box-sizing: border-box;
}
.list_item:first-child{
	margin-top: 0;
}
.list_item{
	width: 100%;
	height: 144rpx;
	border-radius: 12rpx;
	background:#0165FB;
	margin-top: 20rpx;
	padding: 0 30rpx;
	box-sizing: border-box;
}
.list_item_left{
	color: #FFF;
	font-family: Alibaba PuHuiTi 2.0;
	font-size: 60rpx;
	font-weight: 400;
}
.list_item_right{
	margin-left: 8rpx;
}
.list_item_right_top{
	color: #FFF;
	font-family: Alibaba PuHuiTi 2.0;
	font-size: 28rpx;
	font-weight: 400;
}
.list_item_right_bottom{
	color: rgba(255, 255, 255, 0.60);
	font-family: Alibaba PuHuiTi 2.0;
	font-size: 22rpx;
	font-weight: 400;
	margin-top: 5rpx;
}
.list_right{
	text-align: right;
}

</style>
